<template>
    <div class="ann-page">
        <!-- <div class="top">
            <jLink :list="breadcrumbs" @hit="backTo"></jLink>
        </div> -->
        <div class="hts">{{$t('message.other2.ann')}}</div>
        <div class="list">
            <div class="item" v-for="item in list">
                <div class="word" @click="onJump(item)">{{ item.title }}</div>
                <div class="time">
                    {{ item.matTime }}
                </div>
                <!-- <img class="news" src="./news.png"/> -->
            </div>
            <JEmpty v-if="list.length == 0"></JEmpty>
        </div>
        
        <JPage v-if="list.length > 1" class="my-4" :length="totalPage" :model-value="curPage" @update:modelValue="onPage" :total-visible="3">
        </JPage>
    </div>
</template>

<script setup lang="ts">
import { ref, reactive, toRefs, computed, onMounted } from "vue"
import i18n from "@/locals";
import bigDealTable from './components/bigDeal-table.vue';
import rightRank from './components/right-rank.vue';
import JPage from "@/components/j-page/index.vue";
import JEmpty from "@/components/j-empty/index.vue";
import jLink from "@/components/j-link/index.vue";
import { useRouter } from "vue-router";
import { URL_PRESS_NEWS } from "@/comm/api";
import { get } from "@/comm/request";
import { formatTimeAgo, formatTimestamp } from "@/comm/format";
const router = useRouter()
const breadcrumbs = reactive([{
    title: i18n.global.t("message.News.info.b"),
    disabled: true,
    href: '/',
}, {
    title: i18n.global.t("message.other2.ann"),
    disabled: false,
    href: ""
}])

const list = ref<any[]>([]);
const totalPage = ref(0);
const curPage = ref(1);
const pageSize = 20;
const onPage = (v: number) => {
    curPage.value = v;
    console.log(v);
    loadData();
};

const onJump = async (item: any) => {
    console.log(item);
    router.push("/ann/" + item.id);
    // let res: any = await get(URL_PRESS_NEWS + "/" + item.id);
    // console.log(res);
}

onMounted(async () => {
    loadData()
})

async function loadData(){
    let res: any = await get(URL_PRESS_NEWS + "/page", { contentType: 1, size: pageSize, current: curPage.value });
    console.warn('获取新闻信息###########', res.data)

    let ary = res.data.records;
    totalPage.value = res.data.pages;
    ary.sort((a: any, b: any) => (a.date > b.date ? -1 : 1));
    ary.forEach((item: any) => {
        item.time = formatTimeAgo(`${item.date}000`);
        item.matTime = formatTimestamp(Number(`${item.date}000`));
    })

    list.value = ary;
}

const backTo = (e: any) => {
    console.log(e);
    router.push(e.href)
}

</script>

<style lang="less" scoped>
@import url("./index.less");
</style>